<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/fonts/order.css"></link>
	</head>

	<body onload="Load('index.html')">
		<div class="mui-content" style="position: fixed; width: 100%;">
		    <div id="orderTitle">
				<a id="tryBack"><img src="imges/back_arrow.png" style="width: 0.3rem; margin-top: 0.47rem; margin-left: -9.3rem; position: relative;"/></a>
				<div class="My_Oder">My order</div>
			</div>
			
			<div class="greenBgreyT">
				<div id="greenlineBlock">
					<div class="greenBlock greenBlock_left" align="center">
						<img src="imges/ic-tick.png" style="width: 0.5rem; margin-top: 0.25rem;"/>
					</div>
					
					<img src="imges/greenLine.png" style="width: 32%;height: 0.05rem; margin-top: 0.7rem;"/>
					<div class="greenBlock" align="center">
						<img src="imges/ic-tick.png" style="width: 0.5rem; margin-top: 0.25rem;"/>
					</div>	
					
					<img src="imges/greenLine.png" style="width: 32%;height: 0.05rem; margin-top: 0.7rem;"/>
					<div class="greenBlock" align="center">
						<img src="imges/ic-tick.png" style="width: 0.5rem; margin-top: 0.25rem;"/>
					</div>	
				</div>
				<div class="greyT">
					<div class="blockText" style="margin-left:5%;">Preview</div>
					<div class="blockText" style="margin-left:29%;">Confirm</div>
					<div class="blockText" style="margin-left:27%;">Successful</div>
				</div>				
			</div>

			<div id="orderCenter" align="center" style="background-color: white; display: flex; flex-direction: column; flex-grow:1; height: 12rem">
				<div class="bigOrangeDiv">
					<div class="bigOrange">
						<div class="bigOrangeBorder"></div>
						<img src="imges/ic-tick.png" style="margin-top: 1.2rem; width: 1.3rem;"/>
					</div>
					<div class="bigOrangeText">Oder successful!</div>
				</div>
			</div>
			
			<div id="orderFeet">				
				<div id="inOrderFeet">				
					<div id="goOn" class="feetButton" style="background-color: white;">
						<div id="countDiv" class="orangeButton feetBuText" style="width: 100%;"></div>
					</div>				
				</div>
			</div>
		</div>
		<script src="js/mui.min.js"></script>
		<script src="js/jquery.min.js"></script>
		<script type="text/javascript">
			var jsoncai = localStorage.getItem("jsonkey");
			var obj = JSON.parse(jsoncai);
			var sumall = 0;
			document.addEventListener('DOMContentLoaded', function() {
				var html = document.documentElement;
				var windowWidth = html.clientWidth;
				html.style.fontSize = windowWidth / 10.8 + 'px';
			}, false);
			
			tryBack.onclick = function() {
				var tryBack = document.getElementById("tryBack");
				mui.back();
			}
			document.getElementById('goOn').addEventListener('tap', function() {
				mui.ajax({
                    url: "http://api.jhjnzx.com/api/Normal/SaveData",
                    type:'put',
                    method: "put",
                    contentType: 'application/json',
                    data: JSON.stringify(aa()),
                    cache: false,
                    success: function (data) {
//                  	alert(jsoncai);
                        if (data.Status==1) {
                        	alert("单据号:" + data.BillNo);	                       		
                        	window.location = 'index.html';
                        }
                        else {
                            console.log("Error:" + data.Message);
                        }                       
                 },error:function(xhr,type,errorThrown){
						//异常处理；
						console.log(xhr.responseText);
					}
                });
//              alert("tap执行");
			});
			
			var secs = 5; //倒计时的秒数 
			var URL ;
			function Load(url){
				URL = url;
				for(var i = secs; i >= 0; i--) 
				{ 
				   window.setTimeout('doUpdate(' + i + ')', (secs-i) * 1000); 
				} 
			}
			function doUpdate(num) {
				document.getElementById('countDiv').innerHTML = 'OK!('+num+'S)';
				if(num == 0) {
	                mui.ajax({
	                    url: "http://api.jhjnzx.com/api/Normal/SaveData",
	                    type: "put",
	                    contentType: 'application/json',
	                    data: JSON.stringify(aa()),
	                    cache: false,
	                    success: function (data) {
	                    	window.location = URL;
	                        if (data.Status==1) {
	                        	alert("单据号:" + data.BillNo);	                       		
	                        }
	                        else {
	                            alert("Error:" + data.Message);
	                        }
	                    }
	                });
	            }
			}
			
			//生成订单
			function aa() {
				var sumall2 = 0;
				var json = {};
				var orderjson={};
				for(var t = 0; t < obj.length; t++) {
					var j = {};
					var caiobj = obj[t];
					if(caiobj[t]!=""){
						j.MenuId = caiobj[5];
						j.MenuText = caiobj[0];
						j.ItemText = caiobj[1];
						j.ItemId = caiobj[6];
						j.Quantity = parseFloat(caiobj[2]);
						j.ItemPrice = parseFloat(caiobj[3]);
						j.ItemTotal = j.Quantity * j.ItemPrice;
						sumall2 += parseFloat(caiobj[2]) * parseFloat(caiobj[3]);
						json.Detail=j;						
					}
				}
//				var StoreId = localStorage.getItem("StoreId");
				var StoreId = 1;
				json.BillTotal=sumall2;
				json.StoreId=StoreId;
				json.BillType=1;
				orderjson.procName="N_SaveMachineBill";
				var a = JSON.stringify(json);
				orderjson.args=a;
				var aa = JSON.stringify(orderjson);
				return aa;	
			}
		</script>
	</body>
</html>